<template name="elements_executeContract">
    {{#if TemplateVar.get "hasCode"}}

        {{reactiveContext}}

        <div class="dapp-clear-fix"></div>

        <!-- EXECUTE CONTRACT -->
        <div class="execute-contract">
            <!-- <h2> {{i18n "wallet.contracts.contractInformation"}} </h2> -->

            <button class="toggle-visibility dapp-block-button dapp-small">
                {{#if (TemplateVar.get "executionVisible")}}
                    {{i18n "wallet.contracts.buttons.hideContractInfo"}}
                {{else}}
                    {{i18n "wallet.contracts.buttons.showContractInfo"}}
                {{/if}}
            </button>
            
            {{#if TemplateVar.get "executionVisible"}}
            
                <div class="dapp-clear-fix"></div>

                <div class="row clear">
                    <div class="col col-8 mobile-full contract-info">
                        <h2>{{i18n "wallet.contracts.readFromContract"}}</h2>
            
                        <table class="contract-constants dapp-zebra">
                            <tbody>
                            {{#each (TemplateVar.get "contractConstants")}}
                                {{> elements_executeContract_constant}}
                            {{/each}}
                            </tbody>
                        </table>

                    </div>

                    <div class="col col-4 mobile-full contract-functions">
                        {{#with (TemplateVar.get "contractFunctions")}}                    
                            <h2>{{i18n "wallet.contracts.writeToContract"}}</h2>
                            
                            <h4>Select Function</h4>
                            <select class="select-contract-function" name="select-contract-function">
                                <option disabled selected>{{i18n "wallet.contracts.pickFunction"}}</option>
                                {{#each this}}
                                    <option value="{{name}}">{{toSentence name true}}</option>
                                {{/each}}    
                            </select>
                            
                            {{#with TemplateVar.get "selectedFunction"}}
                                {{> elements_executeContract_function}}
                            {{/with}}
                            
                        {{/with}}
                    </div>
                </div>

            {{/if}}
        </div>
    {{/if}}
</template>


<template name="elements_executeContract_constant">
    <tr>
        <td>
            <h3>{{{toSentence name}}}</h3>
            {{#each inputs}}
                {{> Template.dynamic template=template}}
            {{/each}}
        </td>
    </tr>
    <tr>
        <td>
            <dl class="constant-{{name}} dapp-zebra">
            {{#each (TemplateVar.get "outputs")}}
                {{#if name}}
                    <dt>{{{toSentence name}}}</dt>
                {{/if}}
                <dd class="output">
                    {{#each value}}
                        {{#if $eq ../type "address"}}
                            {{> elements_account_link address=this}}
                        {{else}}
                        {{this}}
                        <em> {{{extra}}} </em>
                        {{/if}}
                        <br>
                    {{/each}}
                </dd> 
            {{/each}}
            </dl>
        </td>
    </tr>
</template>


<template name="elements_executeContract_function">
    {{reactiveDataContext}}

    {{#each inputs}}
        {{> Template.dynamic template=template}}
    {{/each}}

    <hr class="dapp-clear-fix">

    <h4>Execute from</h4>
    {{> dapp_selectAccount accounts=selectAccounts showAccountTypes=true}}

    {{#if payable}}
    <h4>
        Send {{> elements_selectableUnit}}
        {{#unless isEtherUnit}}({{dapp_formatBalance (TemplateVar.get "amount") "0,0.00[000000] UNIT" "ether"}}){{/unless}}
    </h4>
    <input type="number" min="0" name="amount" placeholder="0" step="0.001">
    {{/if}}

    <button class="dapp-block-button execute">
        {{#if TemplateVar.get "sending"}} 
            {{i18n 'buttons.sending'}}
        {{else}}
            {{i18n 'wallet.contracts.buttons.execute'}}
        {{/if}}
    </button>
</template>